<template>
  <div class="shouye">
    <van-nav-bar title="外卖" class="nav_bar" fiexd>
      <div slot="right">
        我的
        <van-icon name="/img/nav_bar/2.png" size="20" />
      </div>

      <div slot="left">
        <van-icon name="/img/nav_bar/1.png" size="20" />
        运城学院
      </div>
    </van-nav-bar>

    <div class="search">
      <van-search
        background="#1989fa"
        show-action
        shape="round"
        label="吃啥"
        autofocus
        placeholder="请输入搜索关键词"
      >
        <template #action>
          <div>
            <van-button round type="info" size="small" class="van-but">
              搜索</van-button>
          </div>
        </template>
      </van-search>
      <!-- 轮播图组件 -->
      <swipe></swipe>
    </div>
  </div>
</template>
<script>
import swipe from '../components/shouye/Swipe'

export default {
    components:{swipe},
}
</script>

Swipe
<style scoped>
.shouye {
  /* background-color: red; */
  height: 100px;
  width: 100%;
}
.shouye .nav_bar {
  background-color: #1989fa;
}
.search {
  background-color: red;
  /* margin-top: 10px; */
}

.van-but {
  margin-bottom: 5px;
}
</style>